옵셔널 체이닝 ?.

• ?. 앞의 평가대상이 undefined null 이면 평가를 멈추고 undefined 를 반환
• 연산자가 아님. 함수나 대괄호와 함께 동작하는 특별한 문법 구조체 (Syntax Construct)

let user = {}; // 주소 정보가 없는 사용자

alert( user && user.address && user.address.street );

alert( user?.address?.street );

• 존재하지 않아도 괜찮은 대상에만 사용해야 한다.
  • 위 예시에서는 user 의 address 와 street 가 필수값이 아니기 때문에 옵셔널 체이닝을 사용하였다.
• 옵셔널 체이닝의 남용은 디버깅을 어렵게 할 수 있다
• ?. 앞의 변수는 꼭 선언되어 있어야 한다.
  // ReferenceError: user is not defined

  user?.address;
• 단락 평가(short circuit)

  • ?. 왼쪽의 평가대상에 값이 없으면 즉시 평가를 멈춘다.

  • ?. 오른쪽의 부가 동작은 더이상 일어나지 않음.

    let user = null;

    let x = 0;

    user?.sayHi(x++); // 아무 일도 일어나지 않습니다.

    alert(x); // 0, x는 증가하지 않습니다.

?.() ?.[]

• 옵셔널 체이닝은 함수나 대괄호와 함께 동작하는 특별한 문법 구조체 (Syntax Construct) 이다.

let user1 = {

admin() {

alert("관리자 계정입니다.");

}

};

let user2 = {};

user1.admin?.(); // 관리자 계정입니다.

user2.admin?.();

let user1 = {

firstName: "Violet"

};

let user2 = null; // user2는 권한이 없는 사용자라고 가정해봅시다.

let key = "firstName";

alert( user1?.[key] ); // Violet

alert( user2?.[key] ); // undefined

alert( user1?.[key]?.something?.not?.existing); // undefined

delete 와 옵셔널 체이닝

delete user?.name; // user가 존재하면 user.name을 삭제합니다.

?. 는 쓰기에 사용할 수 없다.

user?.name = "Violet"; // SyntaxError: Invalid left-hand side in assignment

// 에러가 발생하는 이유는 undefined = "Violet"이 되기 때문입니다.